.list{
    width:100vw;
    height: 100vh;
    background-color: #f6f6f7;
}

.navbox-l1,.navbox-l2{
    width: 100%;
    background-color: #fff;
    text-align: center;
    overflow-x: auto;
    padding: 5px;
    height: 80px;
    p{
        margin: 0;
        .nav-item{
            display: inline-block;
            width: 80px;
            background-color: #eee;
            text-align: center;
            margin: 5px;
            padding: 2px;
            border-radius: 5px;
            font-size: 14px;
        }
        
    }
}

.navbox-l2{
    text-align: left;
}

.nav-active{
    font-weight: 700;
    background-color: #f7560c!important;
    color:#fff,
}

.nav-active2{
    font-weight: 700;
    background-color: #0c99f7!important;
    color:#fff,
}

.book-list{
    background-color: #fff;
    margin-top: 10px;
    width: 100%;
    height: 450px;
    overflow-y: auto;
    padding-top: 15px;
}

.list-blank{
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    line-height: 300px;
}

.book-item{
    width:345px;
    margin:0 auto;
    background-color: #F5F6FA;
    border-radius: 5px;
    display: flex;
    padding: 15px;
    margin-bottom: 15px;
    align-items: center;
}
.book-item>img{
    height: 103px;
    width: 77px;
    margin-right: 10px;
}
.buy-msg{
    flex-grow:1;
    .buy-top{
        margin-bottom: 6px;
        display: flex;
        justify-content: space-between;
        .buy-name{
            color:#000 ;
            font-size: 14px;
            font-weight: bold;
        }
        .buy-grade{
            color: #FF8F35;
            font-size: 10px;
            font-weight: bold;
        }
    }
    .msg-description{
        width:155px;
        font-size: 10px;
        color: #A3A3A3;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        margin-bottom: 0;
    }
    .buy-center{
        margin-top: 5px;
        .buy-city{
            font-size: 10px;
            font-weight: bold;
            color: #8D8D8D;
            margin-right: 15px;
        }
        .buy-succes{
            font-size: 10px;
            font-weight: bold;
            color: #8D8D8D;
        }
    }
    .buy-footer{
        display: flex;
        position: relative;
        justify-content: space-between;
        .buy-min{
            color: #FF0030;
            font-size: 10px;
        }
        .buy-new{
            color:#FF0030;
            font-weight: bold;
            font-size: 16px;
        }
        .buy-old{
            color: #E1E1E1;
            font-weight: bold;
            margin-left: 5px;
            text-decoration: line-through;
        }
        img{
            position: absolute;
            width: 25px;
            height: 25px;
            right: 5px;
        }
    }
}
